<template>
	<view class="container">
		<view class="page-body">
			<!-- 计划数据框 -->
			<view class="page-section">
				<view class="title-box">
					<text>每日计划</text>
				</view>

				<view class="plan-body">
					<view class="plan-content">
						<block v-for="(item,index) in plan" :key="index">
							<view class="text-box">
								{{item.txt}}
							</view>
							<view class="plan-item">
								<view class="slider-box">
									<slider class="slider-light" @changing="sliderChanging($event,index)"
										v-model="item.dw" />
								</view>
								<view class="value-box">
									<text>{{item.value}}{{item.unit}}</text>
								</view>
							</view>
						</block>
					</view>
				</view>
			</view>

			<!-- 按钮框 -->
			<view class="page-section">
				<view class="button-body" id="button1">
					<button plain="true" @tap="reset">重置数值</button>
					<button plain="true" @tap="submit">保存修改</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				plan: [{
						txt: "设置摄入热量",
						min: 0,
						max: 4000,
						value: 2000,
						unit: "千卡",
						dw: 50,
					},
					{
						txt: "设置摄入蛋白质",
						min: 0,
						max: 200,
						value: 50,
						unit: "克",
						dw: 25,
					},
					{
						txt: "设置摄入脂肪",
						min: 0,
						max: 100,
						value: 50,
						unit: "克",
						dw: 50,
					},
					{
						txt: "设置摄入糖类",
						min: 0,
						max: 100,
						value: 50,
						unit: "克",
						dw: 50,
					},
					{
						txt: "设置摄入纤维素",
						min: 0,
						max: 100,
						value: 50,
						unit: "克",
						dw: 50,
					},
					{
						txt: "设置消耗热量",
						min: 0,	
						max: 4000,
						value: 2000,
						unit: "千卡",
						dw: 50,
					},
					{
						txt: "设置目标步数",
						min: 0,
						max: 40000,
						value: 10000,
						unit: "步",
						dw: 25,
					}
				],

			}
		},

		onLoad(options) {
			// 当有页面参数时
			if (JSON.stringify(options) !== '{}') {
				uni.showToast({
					title: '已计算出推荐数据'
				});
				let data = JSON.parse(decodeURIComponent(options.data))
				console.log(data)
				this.plan[0].value = data.energy
				this.plan[1].value = data.protein
				this.plan[2].value = data.fat
				this.plan[3].value = data.sugar
				this.plan[4].value = data.cellulose
				this.plan[5].value = data.calories
				this.plan[6].value = data.path
				for (let i in this.plan) {
					let item = this.plan[i]
					let dw = (item.value - item.min) / (item.max - item.min) * 100;
					this.plan[i].dw = dw;
				}
			} else {
				let that = this
				uni.showLoading({
					title: "加载中……"
				});
				this.$https({
					url: that.$baseUrl + '/health/daily',

					success(res) {
						let d = res.data.data;
						// 饮食部分设置
						that.plan[0].value = d.plan.energy;
						that.plan[1].value = d.plan.protein;
						that.plan[2].value = d.plan.fat;
						that.plan[3].value = d.plan.sugar;
						that.plan[4].value = d.plan.cellulose;
						that.plan[5].value = d.plan.calories;
						that.plan[6].value = d.plan.path;
						for (let i in that.plan) {
							let item = that.plan[i]
							let dw = (item.value - item.min) / (item.max - item.min) * 100;
							that.plan[i].dw = dw;
						}
						that.$forceUpdate()
					},
					fail(res) {
						console.log(res)
					},
					complete: e => {
						// 隐藏loading
						uni.hideLoading();
					},
				})
			}
		},

		methods: {
			sliderChanging(evt, i) {
				this.plan[i].dw = evt.target.value
				this.plan[i].value = this.plan[i].dw / 100 * (this.plan[i].max - this.plan[i].min) + this.plan[i].min
			},
			reset() {
				let that = this
				uni.showLoading({
					title: "加载中……"
				});
				this.$https({
					url: that.$baseUrl + '/health/daily',
					success(res) {
						let d = res.data.data;
						// 饮食部分设置
						that.plan[0].value = d.plan.energy;
						that.plan[1].value = d.plan.protein;
						that.plan[2].value = d.plan.fat;
						that.plan[3].value = d.plan.sugar;
						that.plan[4].value = d.plan.cellulose;
						that.plan[5].value = d.plan.calories;
						that.plan[6].value = d.plan.path;
						for (let i in that.plan) {
							let item = that.plan[i]
							let dw = (item.value - item.min) / (item.max - item.min) * 100;
							that.plan[i].dw = dw;
						}
						that.$forceUpdate()
					},
					fail(res) {
						console.log(res)
					},
					complete: e => {
						// 隐藏loading
						uni.hideLoading();
					},
				})
			},
			submit() {
				let that = this
				uni.showLoading({
					title: '上传中'
				})
				this.$https({
					url: that.$baseUrl + '/plan/update',
					method: 'POST',
					data: {
						energy: that.plan[0].value,
						protein: that.plan[1].value,
						fat: that.plan[2].value,
						sugar: that.plan[3].value,
						cellulose: that.plan[4].value,
						calories: that.plan[5].value,
						path: that.plan[6].value
					},
					success(res) {
						console.log(res)
					},
					fail(res) {
						console.log(res)
					},
					complete: e => {
						uni.showToast({
							title: '设置成功',
							duration: 3000
						});

						uni.hideLoading()
					}
				})
			}
		}
	}
</script>

<style>
	@import url("plan.css");
</style>
